<template>
	<view class="container">
		<view class="list border-b" :class="item.Dot==0?'':'redbg'" @click="CaseInfo(item.ID)" v-for="item in List">
			<view class="top"><view class="realname">{{item.RealName}}</view><view class="departname">{{item.DepartName}}</view></view>
			<view class="bottom"><view class="zbrname">承办人：{{item.ZBRRealName}}、{{item.XBRRealName}}</view><view class="afdate">{{Tools.ToTime(item.AFDate)}}</view></view>
			<view :class="item.Dot==0?'hidden':''" class="dot"></view>
		</view>
		<view class="nodata" v-if="NoData"></view>
		<view class="loadmore">{{Tip}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Tip:'正在加载...',
				Page:1,
				List:[],
				NoData:false,
				LoadMore:true
			};
		},
		onPullDownRefresh() {
			this.Re_Load();
		},
		onReachBottom() {
			if(this.LoadMore){
				this.Page++;
				this.Find_Pager();
			}
		},
		onShow() {
			uni.$off("Success");
			uni.$once("Success", item=>{
				this.Re_Load();
			})			
		},
		onLoad(options) {
			this.Find_Pager();
		},
		methods:{
			CaseInfo(ID){
				uni.navigateTo({
					url:'caseinfo?ID='+ID
				})
			},
			Find_Pager(){
				var data={};
				data.Act="Find_CaseAuditList";
				data.Page=this.Page;
				data.Limit=20;
				this.Util.Loading("加载中...");
				this.Util.Post(data, json=>{
					this.Util.HideLoading();
					uni.stopPullDownRefresh();
					this.List= this.List.concat(json.Data.List);
					if(json.Data.Count==0){
						this.NoData=true;
						this.Tip="没有需要审核的案件";
					}
					else if(this.List.length>=json.Data.Count){
						this.LoadMore=false;
						this.Tip="我是有底线的";
					}
				});
			},
			Re_Load(){
				this.List=[];
				this.Page=1;
				this.NoData=false;
				this.LoadMore=true;
				this.Tip='正在加载...';
				this.Find_Pager();
			}
		}
	}
</script>

<style lang="scss">
	.container{width:100%; padding-top:10rpx;
		.list{width:100%; min-height:130rpx; padding-left: 20rpx; padding-top:15rpx; padding-bottom:15rpx; position: relative; background-color: #ffffff; background-image: url('/static/arrow.png'); background-position: center right 10rpx; background-repeat: no-repeat; background-size: 36rpx;
			.top{width:680rpx; min-height:60rpx; line-height:50rpx; padding-bottom:10rpx; display:flex; flex-direction: row; justify-content: space-between;
				.realname{flex:1; font-size:40rpx;}
				.departname{width:250rpx; height:60rpx; font-size:32rpx; color:#1b83db; text-align:right; overflow:hidden;}
			}
			.bottom{width:680rpx; height:40rpx; line-height:40rpx; display:flex; flex-direction: row; justify-content: space-between;
				.zbrname{flex:1; font-size:32rpx; color:#989797;}
				.afdate{width:auto; font-size:32rpx; color:#989797; text-align:right;}
			}
			.dot{width:16rpx; height:16rpx; border-radius:10rpx; position: absolute; background-color:red; right:10rpx; top:20rpx;}
		}
		.list:active{background-color: #eae4e4;}
		.redbg{background-color: #fdecec;}
	}
</style>
